<!--
 * @Descripttion: 
 * @version: 
 * @Author: Zuo
 * @Date: 2021-08-04 16:30:38
 * @LastEditors: Zuo
 * @LastEditTime: 2021-08-04 18:02:29
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /*
            代码执行顺序：同步代码-> 微队列 -> 宏队列
        */
         
        /*
        1. 宏列队: 用来保存待执行的宏任务(回调), 比如: 定时器回调/DOM事件回调/ajax回调
            2. 微列队: 用来保存待执行的微任务(回调), 比如: promise的回调/MutationObserver的回调
            3. JS执行时会区别这2个队列
                JS引擎首先必须先执行所有的初始化同步任务代码
                每次准备取出第一个宏任务执行前, 都要将所有的微任务一个一个取出来执行
        */

        setTimeout(()=>{   //立即放入宏队列
            console.log('timeout1');

            Promise.resolve(1).then(   
            value => console.log('promise5',value)
            )
        },0)
        setTimeout(()=>{   //立即放入宏队列
            console.log('timeout2');
        },0)
        Promise.resolve(1).then(  // 立即放入微队列
            value => {
                console.log('promise1',value)
                setTimeout(()=>{
                    console.log('promise1里的setimeout',value)
                })
            }
        )
        Promise.resolve(2).then(  // 立即放入微队列
            value => console.log('promise2',value)
        )
    </script>
</body>
</html>